﻿<phone:PhoneApplicationPage 
    x:Class="Leuphana.GuidedTour.App.Pages.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="800"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait"  Orientation="Portrait"
    shell:SystemTray.IsVisible="False">

    <!--Transitions-->
    <toolkit:TransitionService.NavigationInTransition>
        <toolkit:NavigationInTransition>
            <toolkit:NavigationInTransition.Backward>
                <toolkit:TurnstileTransition Mode="BackwardIn"/>
            </toolkit:NavigationInTransition.Backward>
            <toolkit:NavigationInTransition.Forward>
                <toolkit:TurnstileTransition Mode="ForwardIn"/>
            </toolkit:NavigationInTransition.Forward>
        </toolkit:NavigationInTransition>
    </toolkit:TransitionService.NavigationInTransition>
    <toolkit:TransitionService.NavigationOutTransition>
        <toolkit:NavigationOutTransition>
            <toolkit:NavigationOutTransition.Backward>
                <toolkit:TurnstileTransition Mode="BackwardOut"/>
            </toolkit:NavigationOutTransition.Backward>
            <toolkit:NavigationOutTransition.Forward>
                <toolkit:TurnstileTransition Mode="ForwardOut"/>
            </toolkit:NavigationOutTransition.Forward>
        </toolkit:NavigationOutTransition>
    </toolkit:TransitionService.NavigationOutTransition>
    
    <!--LayoutRoot-->
    <Grid x:Name="LayoutRoot" Background="Black">
        <controls:Panorama Foreground="White">
            <controls:Panorama.TitleTemplate>
                <DataTemplate>
                    <StackPanel Margin="0,112,0,0" Orientation="Horizontal">
                        <Border Background="White" Height="112" Width="112" Margin="18,0,12,4" />
                        <StackPanel>
                            <TextBlock HorizontalAlignment="Left" Text="Titelzeile 1" FontFamily="Segoe WP SemiLight" FontSize="48" Margin="4,0,0,0"/>
                            <TextBlock HorizontalAlignment="Left" Text="Titelzeile 2" FontSize="96" FontFamily="Segoe WP Semibold" Margin="0,-38,0,0"/>
                        </StackPanel>
                    </StackPanel>
                </DataTemplate>
            </controls:Panorama.TitleTemplate>

            <!--Menu-->
            <controls:PanoramaItem Header="Menü">
                    <StackPanel Orientation="Vertical" Margin="0,255,0,0">
                        <Button HorizontalAlignment="Left" Style="{StaticResource ChromelessButtonStyle}"
                                Command="{Binding NavigateToInfoCommand}">
                        <TextBlock Foreground="White" Text="Info" Style="{StaticResource PhoneTextExtraLargeStyle}" />
                        </Button>
                        <Button HorizontalAlignment="Left" Style="{StaticResource ChromelessButtonStyle}"
                                Command="{Binding NavigateToSettingsCommand}">
                        <TextBlock Foreground="White" Text="Einstellungen" Style="{StaticResource PhoneTextExtraLargeStyle}" />
                        </Button>
                    </StackPanel>
            </controls:PanoramaItem>

            <!--Tour-->
            <controls:PanoramaItem Header="Tour" Orientation="Horizontal">
                <Grid Margin="12,0,0,0">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="173"/>
                        <ColumnDefinition Width="12"/>
                        <ColumnDefinition Width="173"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="173" />
                        <RowDefinition Height="12" />
                        <RowDefinition Height="173" />
                    </Grid.RowDefinitions>

                    <Button Grid.Row="0" Grid.Column="0" Style="{StaticResource ChromelessButtonStyle}"
                            Command="{Binding NavigateToTourCommand}">
                        <Border Background="{StaticResource PhoneAccentBrush}"
                                Height="173" Width="173" Padding="0,12">
                            <TextBlock Text="HotSpots" Style="{StaticResource PhoneTextTitle2Style}"
                                       Foreground="White" VerticalAlignment="Bottom" />
                        </Border>
                    </Button>
                    <Button Grid.Row="0" Grid.Column="2" Style="{StaticResource ChromelessButtonStyle}"
                            Command="{Binding NavigateToTourCommand}" CommandParameter="highlights">
                        <Border Background="{StaticResource PhoneAccentBrush}"
                                Height="173" Width="173" Padding="0,12">
                            <TextBlock Text="Highlights" Style="{StaticResource PhoneTextTitle2Style}"
                                       Foreground="White" VerticalAlignment="Bottom" />
                        </Border>
                    </Button>
                    <Button Grid.Row="2" Grid.ColumnSpan="3" Style="{StaticResource ChromelessButtonStyle}"
                            Command="{Binding NavigateToFirstSpotCommand}">
                        <Border Background="{StaticResource PhoneAccentBrush}"
                                Height="173" Width="358" Padding="0,12">
                            <TextBlock Text="Tour Starten" Style="{StaticResource PhoneTextTitle2Style}"
                                       Foreground="White" VerticalAlignment="Bottom" />
                        </Border>
                    </Button>
                </Grid>
            </controls:PanoramaItem>
            
            <!--Links-->
            <controls:PanoramaItem Header="Infos">
                <ScrollViewer>
                    <StackPanel Orientation="Vertical">
                        <StackPanel Orientation="Horizontal" Margin="0,0,0,24">
                            <Border Height="44" Width="44" CornerRadius="22" BorderThickness="2"
                                BorderBrush="White" Margin="12,6">
                                <TextBlock Style="{StaticResource PhoneTextSubtleStyle}" Text="i"
                                       FontWeight="Bold" Margin="0,0,0,3" FontSize="30" Foreground="White"
                                       HorizontalAlignment="Center" VerticalAlignment="Center"  />
                            </Border>
                            <StackPanel>
                                <TextBlock Style="{StaticResource PhoneTextSubtleStyle}" Foreground="White" Text="Interessante und nützliche Weblinks" />
                                <TextBlock Style="{StaticResource PhoneTextSubtleStyle}" Foreground="White" Text="zu den Inhalten dieser App."  />
                            </StackPanel>
                        </StackPanel>
                    </StackPanel>
                </ScrollViewer>
            </controls:PanoramaItem>
        </controls:Panorama>
    </Grid>

</phone:PhoneApplicationPage>